diode

---

---

A simple event emitter with tools for eventual consistency. Diode only has one event.

Diode.listen(callback)
Diode.emit()

Diode can batch event subscriptions using volley. In short, this means that sequential publications will be clumped:

Diode.listen(callback)

for (var i = 1000; i > 0; i--) {
  Diode.volley()
}

// callback will only fire once

This means that state changes which would activate multiple times, such as an action which affects multiple data stores, will trigger once. This should improve efficiency and simplify actions such as merging records.

It is also quite small (see API). We found ourselves building something similar to it on several projects and decided it was better to keep it in one place.

Usage

For React projects, Diode includes a Stateful mixin, it expects a getState method that is called every time Diode publishes a change.

First include the Stateful mixin into a component, and provide a getState method:

var React    = require('react/addons');
var Stateful = require('diode/stateful');
var MyStore  = require('./myStore');
var Pure     = React.addons.PureRenderMixin;

var Component = React.createClass({
  mixins: [ Stateful, Pure ],

  getState: function() {
    return {
      items: MyStore.all()
    }
  },

  render: function() {
    // render something purely
  }
})

Then in your stores, execute 'publish' on the Diode when you want to propagate a change:

var Diode = require('diode')
var _data = []

MyStore.add = function(record) {
  _data = _data.concat(record)
  Diode.volley()
}

And that's it!

Diode as a decorator

Diode is both an event emitter and a decorator that can add event subscription to another object:

var MyData = Diode({
  data: [],
  add: function(record) {
    this.data.push(record)
    this.publish()
  }
})

New instances of Diode

Diode also supports the new operator:

var myDiode = new Diode()

API

Diode

• listen,subscribe: Add a subscription
• ignore,unsubscribe: Remove a subscription
• emit,publish: Trigger all subscriptions
• volley: Trigger a change lazily, batched together

Stateful

• getState: This method is called by Stateful whenever the Diode executes emit or volley to update the state of a component. It is required.

Changelog

4.4.0

• When executed continuously, at 120 frames per second, volley will allow a change event to slip through every frame. This should better support streaming change events for animation.

Compressed : 592 bytes
Gzipped    : 348 bytes